<template>
  <UserCardList :user-list="userList" :loading="loading"/>
  <van-empty v-if="(!userList || userList.length<1) && !loading" description="找不到队伍"/>
</template>

<script setup lang="ts">
import {useRoute} from "vue-router";
import {onMounted, ref} from "vue";
import myAxios from "../plugins/myAxios.ts";
import 'vant/es/toast/style';
import {showFailToast} from "vant";
import {stringify} from 'qs';
import {userType} from "../models/user";
import UserCardList from "../components/UserCardList.vue";

const route = useRoute()
const {tags} = route.query;

const loading = ref<boolean>(true)

onMounted(async () => {
  const userListData: userType[] = await myAxios.get('/user/search/tags', {
    params: {
      tagNameList: tags,
    },
    // 序列化
    paramsSerializer: (params) => stringify(params, {arrayFormat: 'repeat'})
  }).then((response) => {
    console.log('user/search/tags success', response)
    //showSuccessToast('请求成功')
    return response?.data
  }).catch((error) => {
    console.log('user/search/tags error', error)
    showFailToast('请求失败')
  })
  if (userListData) {
    userListData.forEach(user => {
      if (user.tags) {
        user.tags = JSON.parse(user.tags as any)
        // alert(user.tags)
      }
    })
    userList.value = userListData
  }
  loading.value = false
})


/*
const mockUser = ref({
  id: 1,
  username: 'lyxnb',
  userAccount: 'lyx',
  profile: 'lyxnb 个人简介',
  avatarUrl: 'https://pic2.zhimg.com/v2-af7a97397d2940f107656415a2bbbf89_r.jpg?source=1940ef5c',
  gender: '男',
  phone: '1234321',
  email: '1211@1630.com',
  tags: ['Java', 'Python', 'emo'],
  createTime: new Date(),
})
*/

const userList = ref<userType[]>([])

</script>

<style scoped>

</style>
